<template>
  <div class="m-main-coin">
    <h3>{{$t('token.mainToken')}}</h3>
    <div class="infos table-shadow">
      <div class="line flex-left">
        <img src="../../../assets/img/tip/red.png" alt />
        <label>{{$t('token.title')}}</label>
        <!-- <router-link class="link" to="/mainHolder">{{symbol}}</router-link> -->
        <span>{{symbol}}</span>
        <img :src="baseCoin" class="logo" />
      </div>
      <div class="line flex-left">
        <img src="../../../assets/img/tip/blue.png" alt />
        <label>{{$t('token.time')}}</label>
        <span>{{info.time|formatTime}}</span>
      </div>
      <div class="line flex-left">
        <img src="../../../assets/img/tip/pink.png" alt />
        <label>{{$t('token.holder')}}</label>
        <router-link class="link" to="/mainHolder">{{holders|filterNum}}</router-link>
      </div>
      <div class="line flex-left ind">
        <img src="../../../assets/img/tip/green.png" alt />
        <label>{{$t('token.introduce')}}</label>
        <div class="introduce">
          <pre>
{{introFilter(info)}}
          </pre>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import mainCoin from "@/mixins/Token/mainCoin";
export default {
  mixins: [mainCoin]
};
</script>

<style lang="scss" scoped>
.m-main-coin {
  padding: 10px 0 17px;
  h3 {
    color: $black;
    font-size: 14px;
    font-family: PingFangSC-Semibold;
  }
  .infos {
    margin-top: 10px;
    padding: 10px;
    background: $white;
    border-radius: 2px;
    border: 1px solid rgba(235, 239, 241, 1);
    color: $black;
    font-size: 12px;
    .line {
      min-height: 35px;
      vertical-align: top;
      .link {
        color: $blue;
      }
    }
    .ind {
      padding-top: 5px;
    }
    label {
      min-width: 80px;
      padding-left: 9px;
    }
    .logo {
      height: 20px;
      margin-left: 10px;
    }
    .introduce {
      vertical-align: top;
      display: inline-block;
      text-indent: 2em;
      width: 230px;
      pre {
        white-space: pre-wrap;
        line-height: 20px;
        font-size: 12px;
      }
    }
  }
}
</style>